<template>
    <LayoutEntry :title="title" :keywords="keywords" :description="description" :controller="controller" :action="action">
        <main :id="controller">
            <div class="posts-list">
                <section :key="item.id" v-for="item in list">
                    <a :href="item.url" target="_blank">
                        <h3 class="post-head">{{item.title}}</h3>
                    </a>
                    <div class="post-img">
                        <img src="https://philna.sh/assets/posts/destructured_beers-e79981058aae8ee2744370c5dc0951352039658395b46c74aaa2ba9cfe6aadd7.jpg" alt="">
                    </div>
                    <div class="post-content">
                        {{item.summary}}
                    </div>
                    <div class="post-meta">
                        {{item.moduleName}}
                        <span class="separator">|</span>
                        {{item.hits}}
                        <span class="separator">|</span> 
                        <time>2018年12月10日</time>
                        <span class="separator">|</span>
                        <div class="article-category">
                            <a class="article-category-link" href="/categories/技术相关/">技术相关</a>
                        </div>
                        <span class="separator">|</span>
                        <a href="/tags/#JavaScript1" class="tag">JavaScript1</a>
                        <a href="/tags/#JavaScript2" class="tag">JavaScript2</a>
                    </div>
                </section>
            </div>
            <LayoutAside></LayoutAside>
        </main>
        <LayoutPaging :list="list"></LayoutPaging>
    </LayoutEntry>
</template>
<script type="text/babel">
    import LayoutAside from '../../../component/aside/aside';
    import LayoutPaging from '../../../component/paging/paging';
    export default {
        components: { LayoutAside, LayoutPaging },
    }
</script>

